import { lazy, Suspense } from "react";
import { Navigate, createBrowserRouter } from "react-router-dom";
/* import AuthRoute from "./AuthRoute"; */

const Layout = lazy(() => import("@/pages/index"));
const Home = lazy(() => import("@/pages/home/index"));
const Index = lazy(() => import("@/pages/index/index"));
const NotFound = lazy(() => import("@/pages/404"));
const RichTextEditor = lazy(
  () => import("@/pages/publishArticle/richTextEditor")
);
const MarkDownEditor = lazy(
  () => import("@/pages/publishArticle/markdownEditor")
);
const Published = lazy(() => import("@/pages/published/index"));
const ArticleDetail = lazy(() => import("@/pages/articleDetail/index"));
const SearchPage = lazy(() => import("@/pages/SearchPage/SearchPage"));
const SignIn = lazy(() => import("@/pages/signIn/signIn"));
const SignInTime = lazy(
  () => import("@/pages/signIn/components/signInTime/signInTime")
);
const Welfare = lazy(() => import("@/pages/signIn/components/welfare/welfare"));
const ExChangeDetails = lazy(
  () =>
    import("@/pages/signIn/components/welfare/exChangeDetails/exChangeDetails")
);
const MyHome = lazy(() => import("@/pages/myhome/myhome"));
const MyHomeDynamics = lazy(
  () => import("@/pages/myhome/components/myHomeDynamics/myHomeDynamics")
);
const MyHomePosts = lazy(
  () => import("@/pages/myhome/components/myHomePosts/myHomePosts")
);
const MyHomeColumns = lazy(
  () => import("@/pages/myhome/components/myHomeColumns/myHomeColumns")
);

const Pins = lazy(() => import("@/pages/pins/pins"));
const Setting = lazy(() => import("@/pages/setting/setting"));
const UserInfo = lazy(
  () => import("@/pages/setting/components/userInfo/userInfo")
);
const lazyElement = (value: JSX.Element) => (
  <Suspense
  /* fallback={
      <div>
        <Loading />
      </div>
    } */
  >
    {value}
  </Suspense>
);

const routers = createBrowserRouter([
  {
    path: "/",
    element: lazyElement(<Layout />),
    children: [
      // 根路径时，使用 Navigate 路由重定向至 page1 页面
      {
        path: "",
        element: lazyElement(<Navigate to="/home" />),
      },
      {
        path: "/home",
        element: lazyElement(<Home />),
      },
      {
        path: "/pins",
        element: lazyElement(<Pins />),
      },
      {
        path: "/index",
        element: lazyElement(<Index />),
      },
      {
        path: "/published",
        element: lazyElement(<Published />),
      },
      {
        path: "/articleDetail/:id",
        element: lazyElement(<ArticleDetail />),
      },
      {
        path: "/searchPage",
        element: lazyElement(<SearchPage />),
      },
      {
        path: "/Setting",
        element: lazyElement(<Setting />),
        children: [
          {
            index: true,
            path: "userInfo",
            element: lazyElement(<UserInfo />),
          },
        ],
      },
      {
        path: "/signIn",
        element: lazyElement(<SignIn />),
        children: [
          {
            path: "signInTime",
            element: lazyElement(<SignInTime />),
          },
          {
            path: "welfare",
            element: lazyElement(<Welfare />),
          },
          {
            path: "welfare/exChangeDetails",
            element: lazyElement(<ExChangeDetails />),
          },
        ],
      },
      {
        path: "/myhome",
        element: lazyElement(<MyHome />),
        children: [
          {
            path: "",
            element: lazyElement(<MyHomeDynamics />),
          },
          {
            path: "posts",
            element: lazyElement(<MyHomePosts />),
          },
          {
            path: "columns",
            element: lazyElement(<MyHomeColumns />),
          },
        ],
      },
    ],
  },
  {
    path: "/publishArticle/rich",
    element: lazyElement(<RichTextEditor />),
  },
  {
    path: "/publishArticle/markdown",
    element: lazyElement(<MarkDownEditor />),
  },
  {
    path: "*",
    element: lazyElement(<NotFound />),
  },
]);

export default routers;
